Page({
  data: {
    socketOpen: false,
    inputMessage: '',
    messages: [],
    scrollTop: 0,  // 新增滚动控制变量
  },
  // 在消息更新后添加滚动逻辑
  handleMessageUpdate(newMessages) {
    this.setData({
        messages: newMessages,
        scrollTop: newMessages.length * 10000 // 设置足够大的值确保滚动到底
    }, () => {
        // 使用延时确保渲染完成
        setTimeout(() => {
            this.setData({
                scrollTop: this.data.scrollTop + 1
            })
        }, 50)
    })
  },
  onLoad() {
    // 连接 WebSocket 服务器
    wx.connectSocket({
      url: 'ws://192.168.8.149:8765',
      success: () => {
        console.log('WebSocket 连接成功');
      },
      fail: (err) => {
        console.error('WebSocket 连接失败:', err);
      }
    });

    // 监听 WebSocket 连接打开事件
    wx.onSocketOpen(() => {
      this.setData({
        socketOpen: true
      });
      console.log('WebSocket 连接已打开');
      wx.showToast({
        title: 'WebSocket 连接已打开',
        icon: 'success'
      });
      // 连接成功后可以发送消息
      // this.sendMessage('Hello, WebSocket Server!');
    });

    // 监听 WebSocket 接收到服务器的消息事件
    wx.onSocketMessage((res) => {
      const lastMessage = this.data.messages[this.data.messages.length - 1];
      if (lastMessage?.isSent == true){
        const newMessage = {
          content: res.data,
          isSent: false
        };   
        this.handleMessageUpdate([...this.data.messages, newMessage])
      }else{
        lastMessage.content += res.data;
        this.handleMessageUpdate([...this.data.messages.slice(0, -1), lastMessage])
      }
      console.log('收到服务器消息:', res.data);
    });

    // 监听 WebSocket 连接关闭事件
    wx.onSocketClose(() => {
      this.setData({
        socketOpen: false
      });
      console.log('WebSocket 连接已关闭');
    });

    // 监听 WebSocket 错误事件
    wx.onSocketError((err) => {
      console.error('WebSocket 发生错误:', err);
    });
  },
  onInputChange(e) {
    this.setData({
      inputMessage: e.detail.value
    });
  },
  sendMessage() {
    const message = this.data.inputMessage;
    if (this.data.socketOpen && message) {
      wx.sendSocketMessage({
        data: message,
        success: () => {
          console.log('消息发送成功');
          const newMessage = {
            content: message,
            isSent: true
          };
          this.handleMessageUpdate([...this.data.messages, newMessage])
          this.setData({ inputMessage: '' })  
        },
        fail: (err) => {
          console.error('消息发送失败:', err);
        }
      });
    } else {
      if (!this.data.socketOpen) {
        console.error('WebSocket 连接未打开，无法发送消息');
        wx.showToast({
          title: 'WebSocket 连接未打开，无法发送消息',
          icon: 'none'
        });
      } else {
        console.error('请输入要发送的消息');
      }
    }
  },
  onUnload() {
    // 页面卸载时关闭 WebSocket 连接
    if (this.data.socketOpen) {
      wx.closeSocket();
    }
  }
});
